<template>

  <el-header style="height: 150px;padding-bottom: 100px;margin-top: -30px;">
    <el-row :gutter="20" style="display: flex;justify-content: center">
      <el-col :span="14"><div class="grid-content bg-purple"  />
    <div style="vertical-align: middle;display: inline-block;position: relative;right: 330px;">
      <el-button color="#8590a6" plain style="border-radius: 50px;color: #446dff">学习</el-button>
      <el-button color="#8590a6" plain style="border-radius: 50px;color: #446dff">高中</el-button>
    </div>
    <div style="text-align: center;">
      <span style="margin-bottom: 1px;font-weight: 600;font-size: 24px">我现在在我们高中的重点班，但是我跟不上，我想转普通班可以吗？</span>
    </div>
        <div style="text-align: center;margin-top: 20px;position: relative;right: 125px">
          <el-button type="primary">关注问题</el-button>
          <el-button>写回答</el-button>
          <el-button>关注回答</el-button>&nbsp;
          <svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" data-v-ba633cb8="" style="height: 20px;width: 20px;vertical-align: middle;display: inline-block"><path fill="currentColor" d="M406.656 706.944 195.84 496.256a32 32 0 1 0-45.248 45.248l256 256 512-512a32 32 0 0 0-45.248-45.248L406.592 706.944z"></path></svg>
          <span style="vertical-align: middle;display: inline-block;background-color: transparent;">好问题</span>&nbsp;
          <svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" data-v-ba633cb8="" style="height: 20px;width: 20px;vertical-align: middle;display: inline-block"><path fill="currentColor" d="m64 448 832-320-128 704-446.08-243.328L832 192 242.816 545.472 64 448zm256 512V657.024L512 768 320 960z"></path></svg>
          <span style="vertical-align: middle;display: inline-block">分享</span>&nbsp;
          <svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" data-v-ba633cb8="" style="height: 20px;width: 20px;vertical-align: middle;display: inline-block"><path fill="currentColor" d="m174.72 855.68 130.048-43.392 23.424 11.392C382.4 849.984 444.352 864 512 864c223.744 0 384-159.872 384-352 0-192.832-159.104-352-384-352S128 319.168 128 512a341.12 341.12 0 0 0 69.248 204.288l21.632 28.8-44.16 110.528zm-45.248 82.56A32 32 0 0 1 89.6 896l56.512-141.248A405.12 405.12 0 0 1 64 512C64 299.904 235.648 96 512 96s448 203.904 448 416-173.44 416-448 416c-79.68 0-150.848-17.152-211.712-46.72l-170.88 56.96z"></path></svg>
          <span style="vertical-align: middle;display: inline-block">收藏</span>&nbsp;
          <svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" data-v-ba633cb8="" style="height: 20px;width: 20px;vertical-align: middle;display: inline-block"><path fill="currentColor" d="M288 128h608L736 384l160 256H288v320h-96V64h96v64z"></path></svg>
          <span style="vertical-align: middle;display: inline-block">举报</span>
        </div>
      </el-col>
      <el-col :span="6"><div class="grid-content bg-purple" />
        <div style="height: 150px;">
              <div>
                <span>关注者</span><el-divider direction="vertical" /><span>被浏览</span>
              </div>
          <div style="line-height: 30px">
          <strong>1000</strong>&nbsp;&nbsp;&nbsp;<strong>200000</strong>
          </div>
        </div>
      </el-col>

    </el-row>
  </el-header>


  <el-row :gutter="20" style="display: flex;justify-content: center">
    <el-col :span="14"><div class="grid-content bg-purple"  />
      <el-tabs type="border-card">
        <el-tab-pane label="2000回答">
          <div style="">
            <div class="demo-image" style="position: relative;right: 385px;top: -30px">
              <div v-for="fit in fits" :key="fit" class="block">
                <el-image style="width: 50px; height: 50px" :src="url" :fit="fit" />
              </div>
            </div>
            <div style="position:relative;right: 340px;top: -125px;">
                <p style="font-weight: 600">胡睿</p>
              <p style="margin-top: -10px;font-size: 10px;position:relative;left: 18px">幼儿园人生导师</p>
            </div>
            <div style="width: 50%;margin: 0 auto;margin-top: -145px;">
            <p>
              你以为从重点班到普通班换的仅仅是老师的节奏吗？大概率换的还是你身边的氛围如果你在省重点，头部和尾部班级的师资可能有极大的差距但是如果你在一般的学校，那老师之间的差距可能不会很大的差的更多的是一个个同学营造的班级氛围差的是那股大家一起往前拼 追求更高目标的氛围我高一刚开学那会儿也是在学校的重点班，也是跟不上我一度怀疑自己的智商比身边人低，但是心里面又感觉他们不过如此于是每天活得都很痛苦，感觉自己很牛逼和现实自己又不行，来回摩擦跟不上是常态发呆、走神、扯淡、浮躁、焦虑 都是常态那怎么办？跟不跟上其实无所谓，高一高二学一遍，高三还能学两遍。高中的知识虽然不多，但从来也没打算指望你一遍就能过当你跟不上时，老师的作业你就先往后扔扔因为你写作业的时候也是在凭感觉蒙你先老老实实去把课本相关的知识点看一看，尝试着自己理解理解数学还要想办法自己推导推导公式，理化生不知道，我是文科出身搞完一块，再去找相关的题。自己尝试着做一做，做不出来再看看答案，看懂答案再重新做。就这样慢慢来。高一我数学还是60 70分，跟不上。高二慢慢跟的差不多，大概110多高三第一次月考就150了。后面就常年保持在一百四十多。。。跟不上无所谓但是你不要缴械投降要跟它慢慢磨陪着它反反复复的练慢慢耗死他
            </p>
            </div>
            <div>
              <p>真诚赞赏，手留余香</p>
              <el-button color="rgb(255,51,102)" plain style="border-radius: 50px;color: white;background-color:rgb(255,51,102)">赞赏</el-button>
            </div>
            <div style="width: 100%;height: 50px;position:relative;left: 50px">
              <el-button type="primary" style="height: 20px;width:100px;position: relative;right: 254px;vertical-align: middle;display: inline-block">
                <svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" data-v-ba633cb8="" style="height: 15px;width: 20px;vertical-align: middle;display: inline-block"><path fill="currentColor" d="M512 320 192 704h639.936z"></path></svg>
                <span style="margin-left: 5px;padding:0px 0px 0px 2px;vertical-align: middle;display: inline-block;    background-color: transparent;">赞同</span>
              </el-button>
              <el-button type="primary" style="height: 30px;width:20px;position: relative;right: 260px;vertical-align: middle;display: inline-block">
                <svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" data-v-ba633cb8="" style="height: 15px;width: 20px;position: relative;right: 8px;"><path fill="currentColor" d="m192 384 320 384 320-384z"></path></svg>
              </el-button>
              <svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" data-v-ba633cb8="" style="height: 20px;width: 20px;position:relative;right: 230px;vertical-align: middle;display: inline-block"><path fill="currentColor" d="M736 504a56 56 0 1 1 0-112 56 56 0 0 1 0 112zm-224 0a56 56 0 1 1 0-112 56 56 0 0 1 0 112zm-224 0a56 56 0 1 1 0-112 56 56 0 0 1 0 112zM128 128v640h192v160l224-160h352V128H128z"></path></svg>
              <span style="position: relative;right: 225px;vertical-align: middle;display: inline-block;background-color: transparent;">评论</span>
              <svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" data-v-ba633cb8="" style="height: 20px;width: 20px;position:relative;right: 205px;vertical-align: middle;display: inline-block"><path fill="currentColor" d="m64 448 832-320-128 704-446.08-243.328L832 192 242.816 545.472 64 448zm256 512V657.024L512 768 320 960z"></path></svg>
              <span style="position: relative;right: 200px;vertical-align: middle;display: inline-block">分享</span>
              <svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" data-v-ba633cb8="" style="height: 20px;width: 20px;position:relative;right: 180px;vertical-align: middle;display: inline-block"><path fill="currentColor" d="M283.84 867.84 512 747.776l228.16 119.936a6.4 6.4 0 0 0 9.28-6.72l-43.52-254.08 184.512-179.904a6.4 6.4 0 0 0-3.52-10.88l-255.104-37.12L517.76 147.904a6.4 6.4 0 0 0-11.52 0L392.192 379.072l-255.104 37.12a6.4 6.4 0 0 0-3.52 10.88L318.08 606.976l-43.584 254.08a6.4 6.4 0 0 0 9.28 6.72z"></path></svg>
              <span style="position: relative;right: 175px;vertical-align: middle;display: inline-block">收藏</span>
              <svg viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" data-v-ba633cb8="" style="height: 20px;width: 20px;position:relative;right: 150px;vertical-align: middle;display: inline-block"><path fill="currentColor" d="M288 128h608L736 384l160 256H288v320h-96V64h96v64z"></path></svg>
              <span style="position: relative;right: 145px;vertical-align: middle;display: inline-block">举报</span>

            </div>
          </div>
        </el-tab-pane>


      </el-tabs>


    </el-col>
    <el-col :span="6"><div class="grid-content bg-purple" />
      <div style="width: 296px;height: 330px;border: 1px solid #d3dce6;border-radius: 5px">
        <div style="margin-top: 10px">
          <strong style="position:relative;right: 100px ">相关问题</strong>
        </div>
        <el-divider />
        <div style="margin-top: 10px;font-size: 12px">
          我高一理科没考好，从尖子班掉到了普通班，我总是怕以前老师和同学的嘲笑，我该怎么办？
        </div>
      </div>



    </el-col>

  </el-row>
</template>

<script>
export default {
    data(){
      return{
         fits : [ 'cover'],
         url : 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg'
      }
    }
}
</script>

<style scoped>
    .el-button{
      border-radius: 5px;
    }
    .demo-image .block {
      padding: 30px 0;
      text-align: center;
      border-right: solid 1px ;
      display: inline-block;
      width: 20%;
      box-sizing: border-box;
      vertical-align: top;
    }
    .demo-image .block:last-child {
      border-right: none;
    }
    .demo-image .demonstration {
      display: block;
      color: var(--el-text-color-secondary);
      font-size: 14px;
      margin-bottom: 20px;
    }
</style>